<template>
  <VPage>
    <el-tabs type="border-card">
      <el-tab-pane label="订单配置">
        <div class="box">
          <div class="title">订单</div>
          <p><el-checkbox v-model="order_setting.is_order_chenk_blacklist" label="是否检测订单黑名单。" size="large" true-value="1"
              false-value="0" />
            <span>说明：在【黑名单管理】添加黑名单买家信息，开启该功能后，系统自动检测，发现是黑名单买家，系统会自动将订单设为“问题单”</span>
          </p>
          <p><el-checkbox v-model="order_setting.is_order_profit_rate" label="是否检测订单利润率" size="large" true-value="1"
              false-value="0" /><router-link to="/basic-setup/profit-testing" class="ml-4"> <el-link
                type="primary">利润检测设置</el-link> </router-link> </p>
          <p><el-checkbox v-model="order_setting.is_check_hand_add_order" label="手动新增订单是否需要审核确认。" size="large"
              true-value="1" false-value="0" /><span>说明：手动新增的订单会进入问题单，需人工确认通过/重新检测后，才能执行系统订单流程。</span></p>
          <p><el-checkbox v-model="order_setting.is_split_order_tip" label="是否启用拆单提示" size="large" true-value="1"
              false-value="0" /></p>
          <div class="box mb-2" v-if="Boolean(Number(order_setting.is_split_order_tip))">
            <p class="mb-2">商品数量超过：<el-input v-model="order_setting.product_num_over" type="number"
                style="width: 200px;margin-right: 5px;" />时，系统提示需拆分订单；
            </p>
            <p class="mb-2">订单总重量超过：<el-input v-model="order_setting.total_order_weight_over" type="number"
                style="width: 200px;margin-right: 5px;" />kg时，系统提示需拆分订单；
            </p>
            <p class="mb-2">订单总体积重超过：<el-input v-model="order_setting.total_order_volume_weight_over" type="number"
                style="width: 200px;margin-right: 5px;" />kg时，系统提示需拆分订单；
            </p>
            <p>说明：满足任何一个条件时，系统都会提示拆分订单</p>
          </div>
          <p>系统默认抛重系数：<el-input v-model="order_setting.volume_weight_factor" type="number"
              style="width: 200px;margin-right: 5px;" />说明：系统计算订单抛率时使用，计算公式：抛率=商品体积（cm³）/抛重系数/包裹重量(kg)
          </p>
          <div style="text-align: center;" class="mt-5">
            <el-button type="primary" @click="orderSave" v-hasPermi="[basicSetupAuthList.system_parameter.order_save]">保存</el-button>
          </div>
        </div>
      </el-tab-pane>
      <el-tab-pane label="退款/退货单据设置">
        <div class="box">
          <p>
            <el-checkbox v-model="refund_order_setting.is_add_fba_refund_form" label="是否开启自动生成FBA退款单" size="large"
              true-value="1" false-value="0" />
            <span class="ml-2">说明：勾选后，检测到FBA退款报告时，系统自动生成退款单，可在【订单退款管理】中查询！</span>
          </p>
          <p>
            <el-checkbox v-model="refund_order_setting.is_add_fba_return_form" label="是否开启自动生成FBA退货单" size="large"
              true-value="1" false-value="0" />
            <span class="ml-2">说明：勾选后，检测到FBA退货报告时，系统自动生成退货单，可在【订单退换货管理】中查询！</span>
          </p>
          <div style="text-align: center;" class="mt-5">
            <el-button type="primary" @click="refundSave" v-hasPermi="[basicSetupAuthList.system_parameter.refund_save]">保存</el-button>
          </div>
        </div>
      </el-tab-pane>
    </el-tabs>
  </VPage>
</template>

<script setup>
import { onMounted, reactive, toRefs } from 'vue'
import { query, update } from './api'
import { ElMessage } from 'element-plus'
import {basicSetupAuthList} from '@/Auth/basic-setup.js'
const data = reactive({
  systemData: {},
  order_setting: {},
  refund_order_setting: {}
})
const { systemData, refund_order_setting, order_setting } = toRefs(data)
onMounted(() => {
  query().then(res => {
    systemData.value = res.data
    order_setting.value = res.data.order_setting
    refund_order_setting.value = res.data.refund_order_setting
  })
})
//订单配置保存
const orderSave = () => {

  if (order_setting.value.is_split_order_tip == '1') {
    update({ ...order_setting.value }).then(res => {
      ElMessage({
        message: '保存成功！',
        type: 'success',
      })
    })
  } else {
    const { is_order_chenk_blacklist, is_order_profit_rate, is_check_hand_add_order, is_split_order_tip, volume_weight_factor } = order_setting.value
    update({ is_order_chenk_blacklist, is_order_profit_rate, is_check_hand_add_order, is_split_order_tip, volume_weight_factor }).then(res => {
      ElMessage({
        message: '保存成功！',
        type: 'success',
      })
    })
  }

}
const refundSave = () => {
  update({ ...refund_order_setting.value }).then(res => {
    ElMessage({
      message: '保存成功！',
      type: 'success',
    })
  })
}
</script>
<style lang="scss" scoped>
.box {
  border: 1px solid var(--base-border-color);
  padding: 20px;
  border-radius: 5px;
}

p {
  color: #606266;
  font-size: 14px;
  display: flex;
  align-items: center;
}

:deep(input::-webkit-outer-spin-button),
:deep(input::-webkit-inner-spin-button) {
  -webkit-appearance: none !important;
}

:deep(.el-input__inner) {
  line-height: 1px !important;
}
</style>
